<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Source: xdh-layout/xdh-layout.vue</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Source: xdh-layout/xdh-layout.vue</h1>

    



    
    <section>
        <article>
            <pre class="prettyprint source linenums"><code>&lt;template>
  &lt;el-container :class="wrapperClasses">
    &lt;el-header v-if="northOptions &amp;&amp; $slots.north"
               :class="['xdh-layout__north',{'xdh-layout--split':northOptions.split, 'xdh-layout__north--collapsed': northOptions.collapsed}]"
               :height="northOptions.collapsed ? northOptions.collaspedSize: northOptions.height"
               v-resizable="northOptions.resizable">
      &lt;slot name="north-collapsed" v-if="northOptions.collapsed &amp;&amp; $slots['north-collapsed']">&lt;/slot>
      &lt;slot name="north" v-else>&lt;/slot>
      &lt;div class="xdh-layout-split__north" v-if="northOptions.split" @dblclick="toggleCollapsed('north')">
        &lt;slot name="north-split">
          &lt;i :class="northSplitIcon" @click="toggleCollapsed('north')">&lt;/i>
        &lt;/slot>
      &lt;/div>
    &lt;/el-header>

    &lt;el-main ref="main" v-if="!west &amp;&amp; !east" class="xdh-layout__main">
      &lt;slot>&lt;/slot>
    &lt;/el-main>

    &lt;el-container v-else class="xdh-layout__wrapper">
      &lt;el-aside
        v-if="westOptions &amp;&amp; $slots.west"
        :class="['xdh-layout__west',{'xdh-layout--split':westOptions.split, 'xdh-layout__west--collapsed': westOptions.collapsed}]"
        :width="westOptions.collapsed ? westOptions.collaspedSize : westOptions.width"
        v-resizable="westOptions.resizable">
        &lt;slot name="west-collapsed" v-if="westOptions.collapsed &amp;&amp; $slots['west-collapsed']">&lt;/slot>
        &lt;slot name="west" v-else>&lt;/slot>
        &lt;div class="xdh-layout-split__west" v-if="westOptions.split" @dblclick="toggleCollapsed('west')">
          &lt;slot name="west-split">
            &lt;i :class="westSplitIcon" @click="toggleCollapsed('west')">&lt;/i>
          &lt;/slot>
        &lt;/div>
      &lt;/el-aside>

      &lt;el-main ref="main" v-if="!footerInMain" class="xdh-layout__main">
        &lt;slot>&lt;/slot>
      &lt;/el-main>

      &lt;el-container v-if="footerInMain">
        &lt;el-main ref="main" class="xdh-layout__main">
          &lt;slot>&lt;/slot>
        &lt;/el-main>
        &lt;el-footer v-if="southOptions &amp;&amp; $slots.south"
                   :class="['xdh-layout__south',{'xdh-layout--split':southOptions.split, 'xdh-layout__south--collapsed': southOptions.collapsed}]"
                   :height="southOptions.collapsed ? southOptions.collaspedSize : southOptions.height"
                   v-resizable="southOptions.resizable">
          &lt;slot name="south-collapsed" v-if="southOptions.collapsed">&lt;/slot>
          &lt;slot name="south" v-else>&lt;/slot>
          &lt;div class="xdh-layout-split__south" v-if="southOptions.split" @dblclick="toggleCollapsed('south')">
            &lt;slot name="south-split">
              &lt;i :class="southSplitIcon" @click="toggleCollapsed('south')">&lt;/i>
            &lt;/slot>
          &lt;/div>
        &lt;/el-footer>
      &lt;/el-container>

      &lt;el-aside
        v-if="eastOptions &amp;&amp; $slots.east"
        :class="['xdh-layout__east',{'xdh-layout--split':eastOptions.split, 'xdh-layout__east--collapsed': eastOptions.collapsed}]"
        :width="eastOptions.collapsed ? eastOptions.collaspedSize : eastOptions.width"
        v-resizable="eastOptions.resizable">
        &lt;slot name="east-collapsed" v-if="eastOptions.collapsed &amp;&amp; $slots['east-collapsed']">&lt;/slot>
        &lt;slot name="east" v-else>&lt;/slot>
        &lt;div class="xdh-layout-split__east" v-if="eastOptions.split" @dblclick="toggleCollapsed('east')">
          &lt;slot name="east-split">
            &lt;i :class="eastSplitIcon" @click="toggleCollapsed('east')">&lt;/i>
          &lt;/slot>
        &lt;/div>
      &lt;/el-aside>

    &lt;/el-container>

    &lt;el-footer v-if="!footerInMain &amp;&amp; southOptions &amp;&amp; $slots.south"
               :class="['xdh-layout__south',{'xdh-layout--split':southOptions.split, 'xdh-layout__south--collapsed': southOptions.collapsed}]"
               :height="southOptions.collapsed ? southOptions.collaspedSize : southOptions.height"
               v-resizable="southOptions.resizable">
      &lt;slot name="south-collapsed" v-if="southOptions.collapsed &amp;&amp; $slots['south-collapsed']">&lt;/slot>
      &lt;slot name="south" v-else>&lt;/slot>
      &lt;div class="xdh-layout-split__south" v-if="southOptions.split" @dblclick="toggleCollapsed('south')">
        &lt;slot name="south-split">
          &lt;i :class="southSplitIcon" @click="toggleCollapsed('south')">&lt;/i>
        &lt;/slot>
      &lt;/div>
    &lt;/el-footer>

  &lt;/el-container>
&lt;/template>

&lt;script>
  /**
   * layout布局组件
   * @module widgets/xdh-layout
   * @example
   *
   * // 使用说明
   * &lt;xdh-layout>
   *     &lt;div slot="north">North&lt;/div>
   *     &lt;div>Main&lt;/div>
   *     &lt;div slot="south">South&lt;/div>
   * &lt;/xdh-layout>
   */
  import Resizable from '../../utils/directives/resizable'

  const defaultOptions = {
    split: false,
    collapsed: false,
    collaspedSize: '40px'
  }

  const createResizableOptions = function (region, dir, options, vm) {
    return {
      minWidth: 40,
      minHeight: 40,
      maxWidth: 10000,
      maxHeight: 10000,
      handles: dir,
      edge: 10,
      onlySize: true,
      onStartResize(e) {
        /**
         * 开始拖拽改变尺寸时触发
         * @event on-start-resize
         * @param {string} region 区块 north / south / west / east
         * @param {object} e resizable 事件对象
         */
        vm.$emit('on-start-resize', region, e)
      },
      onStopResize(e) {
        /**
         * 停止拖拽改变尺寸时触发
         * @event on-stop-resize
         * @param {string} region 区块 north / south / west / east
         * @param {object} e resizable 事件对象
         */
        vm.$emit('on-stop-resize', region, e)
      },
      onResize(e) {
        /**
         * 正在拖拽改变尺寸时触发
         * @event on-resize
         * @param {string} region 区块 north / south / west / east
         * @param {object} e resizable 事件对象
         */
        vm.$emit('on-resize', region, e)
      },
      ...options
    }
  }

  /**
   * 插槽
   * @member slot
   * @property {string} [default] 默认表示居中main布局内的插槽
   * @property {string} [north] 顶部插槽
   * @property {string} [south] 底部插槽
   * @property {string} [west] 左侧栏插槽
   * @property {string} [east] 右侧栏插槽
   * @property {string} [north-collapsed] 顶部收起时的内容
   * @property {string} [south-collapsed] 底部收起时的内容
   * @property {string} [west-collapsed] 左侧收起时的内容
   * @property {string} [east-collapsed] 右侧收起时的内容
   * @property {string} [north-split] 顶部分割区内容
   * @property {string} [south-split] 底部分割区内容
   * @property {string} [west-split] 左侧分割区内容
   * @property {string} [east-split] 右侧分割区内容
   */

  export default {
    name: 'XdhLayout',
    directives: {
      Resizable
    },
    /**
     * 属性参数
     * @property {boolean | object} [north = true] north 顶部布局显示开关（或配置参数），传false表示手动关闭顶部布局。支持sync修饰符
     * @property {string} [north.height] north作为配置项时的属性，定义顶部的高度
     * @property {boolean} [north.resizable = false] north作为配置项时的属性，是否允许拖动resize
     * @property {boolean} [north.split = false] north作为配置项时的属性，是否与相邻区域接壤
     * @property {boolean | object} [south = true] south 底部布局显示开关（或配置参数）,配置项参考 south， 支持sync修饰符
     * @property {boolean | object} [west = true] west 左侧栏布局显示开关（或配置参数）,配置项参考 south， 支持sync修饰符
     * @property {boolean | object} [north = true] east 右侧栏布局显示开关（或配置参数）,配置项参考 south， 支持sync修饰符
     * @property {boolean} [footerInMain = false] 定义footer布局块是否放进main布局里面
     * @property {boolean} [fixed = true] 定义头部与顶部 布局是否相对 屏幕固定
     */
    props: {
      // header 配置
      north: {
        type: [Boolean, Object],
        default: true
      },
      // footer 配置
      south: {
        type: [Boolean, Object],
        default: true
      },
      // 左aside配置
      west: {
        type: [Boolean, Object],
        default: true
      },
      // 右aside配置
      east: {
        type: [Boolean, Object],
        default: true
      },
      // footer是否放到main里面
      footerInMain: {
        type: Boolean,
        default: false
      },
      // 是否固定头部和底部
      fixed: {
        type: Boolean,
        default: false
      }
    },
    computed: {
      // 头部布局真实配置项定义
      northOptions() {
        const resizable = this.north.resizable
          ? createResizableOptions('north', 's', this.north.resizable, this)
          : false
        return this.north
          ? {
            height: '60px',
            ...defaultOptions,
            ...this.north,
            resizable: resizable
          }
          : false
      },
      // 底部布局真实配置项定义
      southOptions() {
        const resizable = this.south.resizable
          ? createResizableOptions('south', 'n', this.south.resizable, this)
          : false
        return this.south
          ? {
            height: '40px',
            ...defaultOptions,
            ...this.south,
            resizable: resizable
          }
          : false
      },
      // 左边栏布局真实配置项定义
      westOptions() {
        const resizable = this.west.resizable
          ? createResizableOptions('west', 'e', this.west.resizable, this)
          : false
        return this.west
          ? {
            width: '30%',
            ...defaultOptions,
            ...this.west,
            resizable: resizable
          }
          : false
      },
      // 右边栏布局真实配置项定义
      eastOptions() {
        const resizable = this.east.resizable
          ? createResizableOptions('east', 'w', this.east.resizable, this)
          : false
        return this.east
          ? {
            width: '30%',
            ...defaultOptions,
            ...this.east,
            resizable: resizable
          }
          : false
      },
      // 根据 props的 fixed属性来计算，是否添加 头部/底部 fixed布局的class
      wrapperClasses() {
        return {
          'xdh-layout': true,
          'xdh-layout--fixed': this.fixed
        }
      },
      northSplitIcon() {
        return this.northOptions.collapsed ? 'el-icon-arrow-down' : 'el-icon-arrow-up'
      },
      westSplitIcon() {
        return this.westOptions.collapsed ? 'el-icon-arrow-right' : 'el-icon-arrow-left'
      },
      eastSplitIcon() {
        return this.eastOptions.collapsed ? 'el-icon-arrow-left' : 'el-icon-arrow-right'
      },
      southSplitIcon() {
        return this.southOptions.collapsed ? 'el-icon-arrow-up' : 'el-icon-arrow-down'
      }
    },
    methods: {
      toggleCollapsed(region) {
        const regionOptions = this[`${region}Options`]
        let options = {...regionOptions}
        options.collapsed = !regionOptions.collapsed
        this.$emit(`update:${region}`, options)
        /**
         * 切换时触发
         * @event on-collapsed
         * @param {string} region 区域 west / north / east /south
         * @param {boolean} collapsed 是否折叠收起
         */
        this.$emit('on-collapsed', region, options.collapsed)
      }
    }
  }
&lt;/script>
</code></pre>
        </article>
    </section>




</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Modules</h3><ul><li><a href="module-widgets_xdh-affix.html">widgets/xdh-affix</a></li><li><a href="module-widgets_xdh-anchor.html">widgets/xdh-anchor</a></li><li><a href="module-widgets_xdh-async-img.html">widgets/xdh-async-img</a></li><li><a href="module-widgets_xdh-avatar.html">widgets/xdh-avatar</a></li><li><a href="module-widgets_xdh-back-top.html">widgets/xdh-back-top</a></li><li><a href="module-widgets_xdh-breadcrumb.html">widgets/xdh-breadcrumb</a></li><li><a href="module-widgets_xdh-calendar.html">widgets/xdh-calendar</a></li><li><a href="module-widgets_xdh-capture.html">widgets/xdh-capture</a></li><li><a href="module-widgets_xdh-chart-card.html">widgets/xdh-chart-card</a></li><li><a href="module-widgets_xdh-ckeditor.html">widgets/xdh-ckeditor</a></li><li><a href="module-widgets_xdh-combo.html">widgets/xdh-combo</a></li><li><a href="module-widgets_xdh-contextmenu.html">widgets/xdh-contextmenu</a></li><li><a href="module-widgets_xdh-countdown.html">widgets/xdh-countdown</a></li><li><a href="module-widgets_xdh-countup.html">widgets/xdh-countup</a></li><li><a href="module-widgets_xdh-cropper.html">widgets/xdh-cropper</a></li><li><a href="module-widgets_xdh-curd.html">widgets/xdh-curd</a></li><li><a href="module-widgets_xdh-description-list.html">widgets/xdh-description-list</a></li><li><a href="module-widgets_xdh-dialog.html">widgets/xdh-dialog</a></li><li><a href="module-widgets_xdh-dialog-form.html">widgets/xdh-dialog-form</a></li><li><a href="module-widgets_xdh-dict-table.html">widgets/xdh-dict-table</a></li><li><a href="module-widgets_xdh-dock.html">widgets/xdh-dock</a></li><li><a href="module-widgets_xdh-echarts.html">widgets/xdh-echarts</a></li><li><a href="module-widgets_xdh-ellipsis.html">widgets/xdh-ellipsis</a></li><li><a href="module-widgets_xdh-filter-panel.html">widgets/xdh-filter-panel</a></li><li><a href="module-widgets_xdh-flip.html">widgets/xdh-flip</a></li><li><a href="module-widgets_xdh-form.html">widgets/xdh-form</a></li><li><a href="module-widgets_xdh-form-array.html">widgets/xdh-form-array</a></li><li><a href="module-widgets_xdh-form-divider.html">widgets/xdh-form-divider</a></li><li><a href="module-widgets_xdh-form-group.html">widgets/xdh-form-group</a></li><li><a href="module-widgets_xdh-form-item.html">widgets/xdh-form-item</a></li><li><a href="module-widgets_xdh-form-object.html">widgets/xdh-form-object</a></li><li><a href="module-widgets_xdh-form_items_cascader.html">widgets/xdh-form/items/cascader</a></li><li><a href="module-widgets_xdh-form_items_checkbox.html">widgets/xdh-form/items/checkbox</a></li><li><a href="module-widgets_xdh-form_items_color.html">widgets/xdh-form/items/color</a></li><li><a href="module-widgets_xdh-form_items_date.html">widgets/xdh-form/items/date</a></li><li><a href="module-widgets_xdh-form_items_divider.html">widgets/xdh-form/items/divider</a></li><li><a href="module-widgets_xdh-form_items_editor.html">widgets/xdh-form/items/editor</a></li><li><a href="module-widgets_xdh-form_items_input.html">widgets/xdh-form/items/input</a></li><li><a href="module-widgets_xdh-form_items_input-tag.html">widgets/xdh-form/items/input-tag</a></li><li><a href="module-widgets_xdh-form_items_number.html">widgets/xdh-form/items/number</a></li><li><a href="module-widgets_xdh-form_items_radio.html">widgets/xdh-form/items/radio</a></li><li><a href="module-widgets_xdh-form_items_range.html">widgets/xdh-form/items/range</a></li><li><a href="module-widgets_xdh-form_items_rate.html">widgets/xdh-form/items/rate</a></li><li><a href="module-widgets_xdh-form_items_select.html">widgets/xdh-form/items/select</a></li><li><a href="module-widgets_xdh-form_items_slider.html">widgets/xdh-form/items/slider</a></li><li><a href="module-widgets_xdh-form_items_switch.html">widgets/xdh-form/items/switch</a></li><li><a href="module-widgets_xdh-form_items_tag.html">widgets/xdh-form/items/tag</a></li><li><a href="module-widgets_xdh-form_items_time.html">widgets/xdh-form/items/time</a></li><li><a href="module-widgets_xdh-form_items_tree.html">widgets/xdh-form/items/tree</a></li><li><a href="module-widgets_xdh-form_items_upload.html">widgets/xdh-form/items/upload</a></li><li><a href="module-widgets_xdh-go.html">widgets/xdh-go</a></li><li><a href="module-widgets_xdh-go_go-menu.html">widgets/xdh-go/go-menu</a></li><li><a href="module-widgets_xdh-go_menus_circle-menu.html">widgets/xdh-go/menus/circle-menu</a></li><li><a href="module-widgets_xdh-grid.html">widgets/xdh-grid</a></li><li><a href="module-widgets_xdh-grid-layout.html">widgets/xdh-grid-layout</a></li><li><a href="module-widgets_xdh-header.html">widgets/xdh-header</a></li><li><a href="module-widgets_xdh-image-picker.html">widgets/xdh-image-picker</a></li><li><a href="module-widgets_xdh-image-text.html">widgets/xdh-image-text</a></li><li><a href="module-widgets_xdh-info-box.html">widgets/xdh-info-box</a></li><li><a href="module-widgets_xdh-layout.html">widgets/xdh-layout</a></li><li><a href="module-widgets_xdh-list.html">widgets/xdh-list</a></li><li><a href="module-widgets_xdh-list-panel.html">widgets/xdh-list-panel</a></li><li><a href="module-widgets_xdh-loading.html">widgets/xdh-loading</a></li><li><a href="module-widgets_xdh-marquee.html">widgets/xdh-marquee</a></li><li><a href="module-widgets_xdh-menu.html">widgets/xdh-menu</a></li><li><a href="module-widgets_xdh-menu-toggle.html">widgets/xdh-menu-toggle</a></li><li><a href="module-widgets_xdh-nav-tabs.html">widgets/xdh-nav-tabs</a></li><li><a href="module-widgets_xdh-pager.html">widgets/xdh-pager</a></li><li><a href="module-widgets_xdh-panel.html">widgets/xdh-panel</a></li><li><a href="module-widgets_xdh-print.html">widgets/xdh-print</a></li><li><a href="module-widgets_xdh-result.html">widgets/xdh-result</a></li><li><a href="module-widgets_xdh-scroll.html">widgets/xdh-scroll</a></li><li><a href="module-widgets_xdh-select.html">widgets/xdh-select</a></li><li><a href="module-widgets_xdh-skeleton.html">widgets/xdh-skeleton</a></li><li><a href="module-widgets_xdh-slide-panel.html">widgets/xdh-slide-panel</a></li><li><a href="module-widgets_xdh-swiper.html">widgets/xdh-swiper</a></li><li><a href="module-widgets_xdh-table.html">widgets/xdh-table</a></li><li><a href="module-widgets_xdh-tabs.html">widgets/xdh-tabs</a></li><li><a href="module-widgets_xdh-tabs_sortable.html">widgets/xdh-tabs/sortable</a></li><li><a href="module-widgets_xdh-tag-canvas.html">widgets/xdh-tag-canvas</a></li><li><a href="module-widgets_xdh-tag-select.html">widgets/xdh-tag-select</a></li><li><a href="module-widgets_xdh-timeline.html">widgets/xdh-timeline</a></li><li><a href="module-widgets_xdh-title.html">widgets/xdh-title</a></li><li><a href="module-widgets_xdh-tree.html">widgets/xdh-tree</a></li><li><a href="module-widgets_xdh-tree-select.html">widgets/xdh-tree-select</a></li><li><a href="module-widgets_xdh-tree-table.html">widgets/xdh-tree-table</a></li><li><a href="module-widgets_xdh-virtual-scroller.html">widgets/xdh-virtual-scroller</a></li><li><a href="module-widgets_xdh-virtual-table.html">widgets/xdh-virtual-table</a></li><li><a href="module-widgets_xdh-watermark.html">widgets/xdh-watermark</a></li><li><a href="module-widgets_xdh-window.html">widgets/xdh-window</a></li></ul><h3>Classes</h3><ul><li><a href="module-widgets_xdh-tabs_sortable-Sortable.html">Sortable</a></li><li><a href="Outline.html">Outline</a></li><li><a href="Tag.html">Tag</a></li><li><a href="TagCanvas.html">TagCanvas</a></li></ul><h3>Events</h3><ul><li><a href="module-widgets_xdh-menu-toggle.html#event:change">change</a></li><li><a href="module-widgets_xdh-image-picker.html#~event:click">click</a></li><li><a href="module-widgets_xdh-menu-toggle.html#~event:close">close</a></li><li><a href="module-widgets_xdh-pager.html#~event:current-change">current-change</a></li><li><a href="module-widgets_xdh-tabs.html#~event:edit">edit</a></li><li><a href="module-widgets_xdh-tree-select.html#~event:input">input</a></li><li><a href="module-widgets_xdh-grid-layout.html#~event:layout-updated">layout-updated</a></li><li><a href="module-widgets_xdh-capture.html#~event:on-capture">on-capture</a></li><li><a href="module-widgets_xdh-tag-select.html#~event:on-change">on-change</a></li><li><a href="module-widgets_xdh-calendar.html#~event:on-change-mode">on-change-mode</a></li><li><a href="module-widgets_xdh-tag-select.html#~event:on-checked-all">on-checked-all</a></li><li><a href="module-widgets_xdh-image-picker.html#~event:on-clear">on-clear</a></li><li><a href="module-widgets_xdh-tag-canvas.html#~event:on-click">on-click</a></li><li><a href="module-widgets_xdh-window.html#~event:on-closed">on-closed</a></li><li><a href="module-widgets_xdh-window.html#~event:on-collapsed">on-collapsed</a></li><li><a href="module-widgets_xdh-table.html#~event:on-column-sort">on-column-sort</a></li><li><a href="module-widgets_xdh-nav-tabs.html#~event:on-command">on-command</a></li><li><a href="module-widgets_xdh-cropper.html#~event:on-crop">on-crop</a></li><li><a href="module-widgets_xdh-curd.html#~event:on-dialog-close">on-dialog-close</a></li><li><a href="module-widgets_xdh-curd.html#~event:on-dialog-open">on-dialog-open</a></li><li><a href="module-widgets_xdh-window.html#~event:on-drag">on-drag</a></li><li><a href="module-widgets_xdh-countdown.html#~event:on-end">on-end</a></li><li><a href="module-widgets_xdh-table.html#~event:on-filter">on-filter</a></li><li><a href="module-widgets_xdh-contextmenu.html#~event:on-hide">on-hide</a></li><li><a href="module-widgets_xdh-go_menus_circle-menu.html#~event:on-item-click">on-item-click</a></li><li><a href="module-widgets_xdh-list-panel.html#~event:on-load-complete">on-load-complete</a></li><li><a href="module-widgets_xdh-window.html#~event:on-minimized">on-minimized</a></li><li><a href="module-widgets_xdh-contextmenu.html#~event:on-mouseenter">on-mouseenter</a></li><li><a href="module-widgets_xdh-contextmenu.html#~event:on-mouseleave">on-mouseleave</a></li><li><a href="module-widgets_xdh-header.html#~event:on-nav-select">on-nav-select</a></li><li><a href="module-widgets_xdh-capture.html#~event:on-output">on-output</a></li><li><a href="module-widgets_xdh-filter-panel.html#~event:on-query'">on-query'</a></li><li><a href="module-widgets_xdh-table.html#~event:on-reach-bottom">on-reach-bottom</a></li><li><a href="module-widgets_xdh-table.html#~event:on-reach-top">on-reach-top</a></li><li><a href="module-widgets_xdh-go.html#~event:on-ready">on-ready</a></li><li><a href="module-widgets_xdh-nav-tabs.html#~event:on-remove">on-remove</a></li><li><a href="module-widgets_xdh-filter-panel.html#~event:on-reset">on-reset</a></li><li><a href="module-widgets_xdh-window.html#~event:on-resize">on-resize</a></li><li><a href="module-widgets_xdh-table.html#~event:on-row-sort">on-row-sort</a></li><li><a href="module-widgets_xdh-table.html#~event:on-scroll">on-scroll</a></li><li><a href="module-widgets_xdh-header.html#~event:on-search">on-search</a></li><li><a href="module-widgets_xdh-calendar.html#~event:on-select-day">on-select-day</a></li><li><a href="module-widgets_xdh-calendar.html#~event:on-select-month">on-select-month</a></li><li><a href="module-widgets_xdh-calendar.html#~event:on-select-year">on-select-year</a></li><li><a href="module-widgets_xdh-tree-select.html#~event:on-selected">on-selected</a></li><li><a href="module-widgets_xdh-contextmenu.html#~event:on-show">on-show</a></li><li><a href="module-widgets_xdh-slide-panel.html#~event:on-slide">on-slide</a></li><li><a href="module-widgets_xdh-window.html#~event:on-start-drag">on-start-drag</a></li><li><a href="module-widgets_xdh-window.html#~event:on-start-resize">on-start-resize</a></li><li><a href="module-widgets_xdh-timeline.html#~event:on-state">on-state</a></li><li><a href="module-widgets_xdh-window.html#~event:on-stop-drag">on-stop-drag</a></li><li><a href="module-widgets_xdh-window.html#~event:on-stop-resize">on-stop-resize</a></li><li><a href="module-widgets_xdh-curd.html#~event:on-success">on-success</a></li><li><a href="module-widgets_xdh-header.html#~event:on-tool-click">on-tool-click</a></li><li><a href="module-widgets_xdh-contextmenu.html#~event:on-trigger">on-trigger</a></li><li><a href="global.html#event:on-upload">on-upload</a></li><li><a href="module-widgets_xdh-menu-toggle.html#~event:open">open</a></li><li><a href="module-widgets_xdh-form.html#~event:reset">reset</a></li><li><a href="module-widgets_xdh-filter-panel.html#~event:reset-expand-fields">reset-expand-fields</a></li><li><a href="module-widgets_xdh-menu-toggle.html#~event:select">select</a></li><li><a href="module-widgets_xdh-pager.html#~event:size-change">size-change</a></li><li><a href="module-widgets_xdh-form.html#~event:submit">submit</a></li><li><a href="module-widgets_xdh-tabs.html#~event:tab-add">tab-add</a></li><li><a href="module-widgets_xdh-tabs.html#~event:tab-click">tab-click</a></li><li><a href="module-widgets_xdh-tabs.html#~event:tab-remove">tab-remove</a></li><li><a href="module-widgets_xdh-filter-panel.html#~event:toggle">toggle</a></li><li><a href="module-widgets_xdh-affix.html#event:change">change</a></li><li><a href="module-widgets_xdh-back-top.html#event:click">click</a></li><li><a href="module-widgets_xdh-curd.html#~event:update:query">update:query</a></li><li><a href="module-widgets_xdh-filter-panel.html#~event:update:model">update:model</a></li></ul><h3>Global</h3><ul><li><a href="global.html#AddShadowToImage">AddShadowToImage</a></li><li><a href="global.html#getWaterPositions">getWaterPositions</a></li><li><a href="global.html#loadAreaData">loadAreaData</a></li><li><a href="global.html#objToData">objToData</a></li><li><a href="global.html#props">props</a></li><li><a href="global.html#RoundImage">RoundImage</a></li><li><a href="global.html#setAreaData">setAreaData</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.4</a> on Tue May 12 2020 16:50:34 GMT+0800 (GMT+08:00)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>
